<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="工厂名称">
              <j-input placeholder="请输入工厂名称" v-model="queryParam.factoryName"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a-button @click="handleAdd" type="primary" icon="plus" style="margin-left: 8px">新增</a-button>
              <!--<a @click="handleToggleSearch" style="margin-left: 8px">-->
                <!--{{ toggleSearchStatus ? '收起' : '展开' }}-->
                <!--<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>-->
              <!--</a>-->
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <!--<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>-->
      <!--<a-button type="primary" icon="download" @click="handleExportXls('工厂建模')">导出</a-button>-->
      <!--<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"-->
                <!--@change="handleImportExcel">-->
        <!--<a-button type="primary" icon="import">导入</a-button>-->
      <!--</a-upload>-->
      <!-- 高级查询区域 -->
      <!--<j-super-query :fieldList="superFieldList" ref="superQueryModal"-->
                     <!--@handleSuperQuery="handleSuperQuery"></j-super-query>-->
      <!--<a-dropdown v-if="selectedRowKeys.length > 0">-->
        <!--<a-menu slot="overlay">-->
          <!--<a-menu-item key="1" @click="batchDel">-->
            <!--<a-icon type="delete"/>-->
            <!--删除-->
          <!--</a-menu-item>-->
        <!--</a-menu>-->
        <!--<a-button style="margin-left: 8px"> 批量操作-->
          <!--<a-icon type="down"/>-->
        <!--</a-button>-->
      <!--</a-dropdown>-->
    </div>

    <!-- table区域-begin -->
    <div>

      <a-table
        ref="table"
        size="middle"
        rowKey="id"
        class="j-table-force-nowrap"
        :scroll="{x:true}"
        bordered
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :expandedRowKeys="expandedRowKeys"
        @change="handleTableChange"
        @expand="handleExpand"
        v-bind="tableProps">

        <template slot="imgSlot" slot-scope="text,record">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt=""
               style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button
            v-else
            :ghost="true"
            type="primary"
            icon="download"
            size="small"
            @click="downloadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical"/>
          <a-popconfirm title="确定禁用吗?" @confirm="() =>changeState(record.id,2)"
                        v-if="record.factoryStatus==='1'" placement="topLeft">
                  <a>禁用</a>
          </a-popconfirm>
          <a-popconfirm title="确定启用吗?" @confirm="() =>changeState(record.id,1)" v-else placement="topLeft">
                  <a>启用</a>
          </a-popconfirm>
          <a-divider type="vertical"/>
          <a-dropdown v-if="record.factoryLevel!=='5'">
            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
            <a-menu slot="overlay">
              <a-menu-item>
                <a @click="handleAddChild(record)">添加下级</a>
              </a-menu-item>
              <a-menu-item>
                <a-popconfirm title="确定删除吗?" @confirm="() => handleDeleteNode(record.id)" placement="topLeft">
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
          <a-popconfirm v-else title="确定删除吗?" @confirm="() => handleDeleteNode(record.id)" placement="topLeft">
                  <a>删除</a>
          </a-popconfirm>
        </span>

      </a-table>
    </div>

    <mesBaseFactory-modal ref="modalForm" @ok="modalFormOk"></mesBaseFactory-modal>
  </a-card>
</template>

<script>

  import { getAction, deleteAction, postAction } from '@/api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import MesBaseFactoryModal from './modules/MesBaseFactoryModal'
  import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
  import { filterObj } from '@/utils/util'

  export default {
    name: 'MesBaseFactoryList',
    mixins: [JeecgListMixin],
      components: {
      MesBaseFactoryModal
    },
    data() {
      return {
        description: '工厂建模管理页面',
        // 表头
        columns: [
          {
            title: '工厂名称',
            align: 'left',
            dataIndex: 'factoryName'
          },
          {
            title: '工厂级别',
            align: 'left',
            dataIndex: 'factoryLevel_dictText'
          },
          {
            title: '工厂状态',
            align: 'left',
            dataIndex: 'factoryStatus_dictText'
          },
          {
            title: '工厂备注',
            align: 'left',
            dataIndex: 'factoryRemark'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align: 'center',
            fixed: 'right',
            width: 147,
            scopedSlots: { customRender: 'action' }
          }
        ],
        url: {
          list: '/mes/mesBaseFactory/rootList',
          childList: '/mes/mesBaseFactory/childList',
          getChildListBatch: '/mes/mesBaseFactory/getChildListBatch',
          delete: '/mes/mesBaseFactory/delete',
          deleteBatch: '/mes/mesBaseFactory/deleteBatch',
          exportXlsUrl: '/mes/mesBaseFactory/exportXls',
          importExcelUrl: 'mes/mesBaseFactory/importExcel',
          changeState: '/mes/mesBaseFactory/changeFactoryStatue'
        },
        expandedRowKeys: [],
        hasChildrenField: 'hasChild',
        pidField: 'pid',
        dictOptions: {},
        loadParent: false,
        superFieldList: []
      }
    },
    created() {
      this.getSuperFieldList()
    },
    computed: {
      importExcelUrl() {
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
      },
      tableProps() {
        let _this = this
        return {
          // 列表项是否可选择
          // rowSelection: {
          //   selectedRowKeys: _this.selectedRowKeys,
          //   onChange: (selectedRowKeys) => _this.selectedRowKeys = selectedRowKeys
          // }
        }
      }
    },
    methods: {
      changeState(id, status) {
        postAction(this.url.changeState, { id: id, factoryStatus: status }).then(res => {
          if (res.success) {
            let result = res.result
          } else {
            this.$message.warning(res.message)
          }
        }).finally(() => {
          this.loadData(1)
        })
      },
      loadData(arg) {
        if (arg == 1) {
          this.ipagination.current = 1
        }
        this.loading = true
        let params = this.getQueryParams()
        params.hasQuery = 'true'
        getAction(this.url.list, params).then(res => {
          if (res.success) {
            let result = res.result
            if (Number(result.total) > 0) {
              this.ipagination.total = Number(result.total)
              this.dataSource = this.getDataByResult(res.result.records)
              return this.loadDataByExpandedRows(this.dataSource)
            } else {
              this.ipagination.total = 0
              this.dataSource = []
            }
          } else {
            this.$message.warning(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },
      // 根据已展开的行查询数据（用于保存后刷新时异步加载子级的数据）
      loadDataByExpandedRows(dataList) {
        if (this.expandedRowKeys.length > 0) {
          return getAction(this.url.getChildListBatch, { parentIds: this.expandedRowKeys.join(',') }).then(res => {
            if (res.success && res.result.records.length > 0) {
              //已展开的数据批量子节点
              let records = res.result.records
              const listMap = new Map()
              for (let item of records) {
                let pid = item[this.pidField]
                if (this.expandedRowKeys.join(',').includes(pid)) {
                  let mapList = listMap.get(pid)
                  if (mapList == null) {
                    mapList = []
                  }
                  mapList.push(item)
                  listMap.set(pid, mapList)
                }
              }
              let childrenMap = listMap
              let fn = (list) => {
                if (list) {
                  list.forEach(data => {
                    if (this.expandedRowKeys.includes(data.id)) {
                      data.children = this.getDataByResult(childrenMap.get(data.id))
                      fn(data.children)
                    }
                  })
                }
              }
              fn(dataList)
            }
          })
        } else {
          return Promise.resolve()
        }
      },
      getQueryParams(arg) {
        //获取查询条件
        let sqp = {}
        let param = {}
        if (this.superQueryParams) {
          sqp['superQueryParams'] = encodeURI(this.superQueryParams)
          sqp['superQueryMatchType'] = this.superQueryMatchType
        }
        if (arg) {
          param = Object.assign(sqp, this.isorter, this.filters)
        } else {
          param = Object.assign(sqp, this.queryParam, this.isorter, this.filters)
        }
        if (JSON.stringify(this.queryParam) === '{}' || arg) {
          param.hasQuery = 'false'
        } else {
          param.hasQuery = 'true'
        }
        param.field = this.getQueryField()
        param.pageNo = this.ipagination.current
        param.pageSize = this.ipagination.pageSize
        return filterObj(param)
      },
      searchReset() {
        //重置
        this.expandedRowKeys = []
        this.queryParam = {}
        this.loadData(1)
      },
      getDataByResult(result) {
        if (result) {
          return result.map(item => {
            //判断是否标记了带有子节点
            if (item[this.hasChildrenField] == '1') {
              let loadChild = { id: item.id + '_loadChild', name: 'loading...', isLoading: true }
              item.children = [loadChild]
            }
            return item
          })
        }
      },
      handleExpand(expanded, record) {
        // 判断是否是展开状态
        if (expanded) {
          this.expandedRowKeys.push(record.id)
          if (record.children.length > 0 && record.children[0].isLoading === true) {
            let params = this.getQueryParams(1)//查询条件
            params[this.pidField] = record.id
            params.hasQuery = 'false'
            params.superQueryParams = ''
            getAction(this.url.childList, params).then((res) => {
              if (res.success) {
                if (res.result.records) {
                  record.children = this.getDataByResult(res.result.records)
                  this.dataSource = [...this.dataSource]
                } else {
                  record.children = ''
                  record.hasChildrenField = '0'
                }
              } else {
                this.$message.warning(res.message)
              }
            })
          }
        } else {
          let keyIndex = this.expandedRowKeys.indexOf(record.id)
          if (keyIndex >= 0) {
            this.expandedRowKeys.splice(keyIndex, 1)
          }
        }
      },
      handleAddChild(record) {
        this.loadParent = true
        let obj = {}
        obj[this.pidField] = record['id']
        if(record.factoryLevel=='5'){
          this.$message.error("此节点不能创建下级!")
          return
        }
        obj['parentFactoryLevel'] = record['factoryLevel']
        this.$refs.modalForm.add(obj)
      },
      handleDeleteNode(id) {
        if (!this.url.delete) {
          this.$message.error('请设置url.delete属性!')
          return
        }
        var that = this
        deleteAction(that.url.delete, { id: id }).then((res) => {
          if (res.success) {
            that.loadData(1)
          } else {
            that.$message.warning(res.message)
          }
        })
      },
      batchDel() {
        if (this.selectedRowKeys.length <= 0) {
          this.$message.warning('请选择一条记录！')
          return false
        } else {
          let ids = ''
          let that = this
          that.selectedRowKeys.forEach(function(val) {
            ids += val + ','
          })
          that.$confirm({
            title: '确认删除',
            content: '是否删除选中数据?',
            onOk: function() {
              that.handleDeleteNode(ids)
              that.onClearSelected()
            }
          })
        }
      },
      getSuperFieldList() {
        let fieldList = []
        fieldList.push({ type: 'string', value: 'pid', text: '父级节点', dictCode: '' })
        fieldList.push({ type: 'string', value: 'factoryName', text: '工厂名称', dictCode: '' })
        fieldList.push({ type: 'string', value: 'factoryLevel', text: '工厂级别', dictCode: 'factory_level' })
        fieldList.push({ type: 'string', value: 'factoryStatus', text: '工厂状态', dictCode: 'factory_status' })
        fieldList.push({ type: 'string', value: 'factoryRemark', text: '工厂备注', dictCode: '' })
        this.superFieldList = fieldList
      }
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>